import FileMenu from "@/app/components/FileMenu";
export default async function SplitPdf(props) {
  const params = await props.params;
  const itemStyle = {
    float: "right",
    padding: "3px 0 2px 8px",
    zIndex: "5",
  };

  return (
    <>
      <FileMenu pdfName={params.slug}></FileMenu>

      <ol id="filelist">
        <li data-file="0b499388f1i4.pdf" draggable="false" className="">
          <a
            style={itemStyle}
            href="/download/0b499388f1i4.pdf"
            title="Download 犯罪心理学.pdf"
            draggable="false"
          >
            <img
              width="18"
              height="18"
              src="/img/save.svg"
              alt="Download"
              draggable="false"
            />
          </a>{" "}
          <a
            style={itemStyle}
            href="/merge/7b8fa36a6fi4.pdf"
            title="Remove 犯罪心理学.pdf"
            draggable="false"
          >
            <img
              width="18"
              height="18"
              src="/img/delete.svg"
              alt="Remove"
              draggable="false"
            />
          </a>
          <img
            src="https://i4.pdfresizer.com/tmp/thb-0b499388f1i4.pdf-01.jpg"
            className="thb"
            alt=""
            title="犯罪心理学.pdf"
            draggable="false"
          />
          <strong>犯罪心理学.pdf</strong>
          <span className="params">
            Size: 1,26 MB, pages: 73, paper: 334.084 x 501.955 pts
          </span>
        </li>
      </ol>

      <div className="options">
        <label className="checkbox">
          <input
            type="checkbox"
            name="page_per_file"
            className="single"
            checked="checked"
          />{" "}
          one page per file{" "}
        </label>
        <br />
        <label className="checkbox">
          <input
            type="checkbox"
            name="specific_pages"
            className="single toggle-sub-options"
          />{" "}
          specific set of pages{" "}
        </label>
        <span className="sub-options" style={{ display: "none" }}>
          <label htmlFor="from">From:</label>
          <input
            type="number"
            className="text number"
            name="from"
            id="from"
            value="1"
            step="1"
            min="1"
          />
          <label htmlFor="to">To:</label>
          <input
            type="number"
            className="text number"
            name="to"
            id="to"
            value="3"
            step="1"
            min="1"
          />
        </span>
      </div>
      <input id="sbmt" className="action-button active" value="Split PDF! »" type="submit" name="submit"></input>
    </>
  );
}
